
 
 let children =  {
   template:`
   <a-layout id="components-layout-demo-top"  class="layout">
      <a-layout-header>
      <a-row class="a-row">
      <a-col class="a-col" :md="6" :span="11" v-if='flag'>
    <img :src="srcs" class="logo"   @click="home"/>

      </a-col>
      <a-col class="a-col" style="text-align: left" :md="15" :span="10">      
        <div class="wai">                
          <div
          class="parent"
          :style="{ color: count == index ? CoLor : '#FFF' }"
           
            @mouseenter="info(index)"
            @mouseleave="hid(index)"
            v-for="(item, index) in Data"
            :key="index"
          >
            <span class="shang" :class="{activeb:count==index}"  >{{ item.meta.title }}</span>
                     
            <div
              class="children"
              :style="{ display: count == index ? hide : 'none' }"
            >
            <!-- style="color:#fff" -->
              <div
               class="child"
               
                v-for="(item, index) in item.children"
                :key="index"
                @click='seleter(item.path)'
              >
               {{  item.meta.title }}
              </div>
                        
            </div>
                          
          </div>
              
        </div>
      </a-col>
      <a-col class="a-col" :md="2" :span="3">
        <span>登录</span>
      <img :src="login" alt="">
      </a-col>
    </a-row> 

      </a-layout-header>
      <a-layout-content style="padding: 0 50px;">
        <a-breadcrumb style="margin: 16px 0; ">
          <a-breadcrumb-item v-for='(item,index) in Breadcrumb' :key='index'>{{ item }}</a-breadcrumb-item>
        </a-breadcrumb>
        <slot/>
      </a-layout-content>
      <a-layout-footer style="text-align: center">
        <slot name='footer'/>
      </a-layout-footer>
    </a-layout>
   `,

  
   data() {
      return {
        count: 0,
        hide: "none",
        CoLor:'#fff',
      }
   },
   props:{
      //logo 状态
     flag:{
        type:Boolean,
        default(){
         return this.app
       },
     },
     Data:{
      type:Array,
      default:()=>[]
   },
   Breadcrumb:{
     type:Array,
     default:()=>[]
   },
   srcs:{
     type:String,
     default:'http://localhost:8080/ui/demo/assets/images/logo.png'
   },
   login:{
    type:String,
    default:'http://localhost:8080/ui/demo/assets/images/avatar.png'
  },
  Fuc:{
    type:Function,
    default:function(){
     console.log(2222)
    }
  }
   },
   mounted() {
 
   }, 
   methods: {
    info(index) {
       this.count = index
       this.hide = 'block'
      this.CoLor = '#f8b551'
    },
    hid() {
      this.hide = "none";
       this.CoLor = '#fff'
    },
    //首页路由
    home(){
      this.$router.push({path:'/home'})
    },
    seleter(path){
      // console.log(path)
      // this.$emit('fuc','./component.html')
      this.$router.push({ path })
    },
    routers(){
      this.$emit('fuc','/login')
    }
   },
}


